<div class="wrapper-md">
  <div class="row">
    <div class="col-md-12">
      <div class="row row-sm text-center">
        <!-- 产品数量 -->
        <div class="col-xs-3" >
          <a class="block panel padder-v bg-info item">
            <span class="text-white font-thin h1 block"><i class="fa fa-flag"></i></span>
            <span class="text-muted text-md">
            <span >产品数量</span>:
            <span class="text-muted text-lg">{{num?.product}}</span>
            </span>
            <span class="top text-left">
            </span>
          </a>
        </div>
        <!-- 设备数量 -->
        <div class="col-xs-3" >
          <a class="block panel padder-v bg-success item">
            <span class="text-white font-thin h1 block"><i class="fa fa-cogs"></i></span>
            <span class="text-muted text-md">
            <span >设备数量</span>:<span class="text-muted text-lg">{{num?.device}}</span></span>

          </a>
        </div>
        <!-- 用户数量 -->
        <div class="col-xs-3" >
          <a class="block panel padder-v bg-primary item">

            <span class="text-white font-thin h1 block"><i class="fa fa-users"></i></span>
            <span class="text-muted text-md">
            <span >用户数量</span>:<span class="text-muted text-lg">{{num?.account}}</span></span>
            <span class="top text-left">
            </span>
          </a>
        </div>
        <!-- 故障数量 -->
        <div class="col-xs-3" >
          <a class="block panel padder-v bg-danger item">
            <span class="text-white font-thin h1 block"><i class="fa fa-exclamation"></i></span>
            <span class="text-muted text-md">
            <span >故障数量</span>:<span class="text-muted text-lg">{{num?.fault}}</span></span>
            <span class="top text-left">
            </span>
          </a>
        </div>
      </div>
    </div>

    <div class="col-md-12">
      <div class="row">
        <!-- 地图统计 -->
        <div>
          <div class="col-sm-7" >
            <div class="panel panel-default">
              <div class="panel-body">
                <chart-map></chart-map>
              </div>
            </div>
          </div>
        </div>


        <!-- 饼图统计 -->
        <div class="col-sm-5">
          <div class="panel panel-default m-l-n-sm">
            <div class="panel-body m-b-n-sm" >
              <chart-run></chart-run>
            </div>
          </div>
          <div class="panel panel-default m-t-n-sm m-l-n-sm">
            <div class="panel-body m-b-n-sm" >
              <chart-fault></chart-fault>
            </div>
          </div>

        </div>
      </div>
    </div>

    <div class="col-md-12">
      <div class="panel panel-default">
        <div class="panel-heading font-bold">
          <span>设备故障次数</span>
        </div>
        <div class="panel-body">
          <chart-ofault></chart-ofault>
        </div>
      </div>
    </div>


    <chart-power></chart-power>
  </div>
</div>
